<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>Document</title>
</head>
<style>
  .home {
    width: 100%;
    border-radius: 10px;
    padding: 20px;
    box-sizing: border-box;
    margin-top: 450px;
    position: relative;
  }

  .agreement-button {
    padding: 10px 45px;
    border: 1px solid #54B6AB;
    border-radius: 10px;
    width: 50px;
    text-align: center;
    color: #54B6AB;
  }

  .agreement {
    background-color: #54B6AB;
    color: #fff;
  }

  .text {
    margin: 0 auto 10px;
    text-align: center;
  }

  .button {
    display: flex;
    justify-content: space-between;
    align-items: center;

  }

  .popup {
    position: absolute;
    width: 350px;
    box-sizing: border-box;
    text-align: center;
    border: 1px solid #54B6AB;
    border-radius: 10px;
    top: 300px;
    padding: 20px;
    margin-left: 6px;
  }

  .confirm {
    margin-bottom: 10px;
  }

  h2 {
    text-align: center;
  }
</style>


<body>
  <div class="popup" id="popup">
    <div class="confirm">您确定要进行隐私授权</div>
    <div class="button">
      <div class="agreement-button">取消</div>
      <div class="agreement-button agreement">确定</div>
    </div>
  </div>
  <h2>授权</h2>
  <div class="text">您是否接受xxx管理您的身体健康</div>
  <div class="home">
    <div class="button">
      <div class="agreement-button">不同意</div>
      <div class="agreement-button agreement" id="agreement">同意</div>
    </div>
  </div>

  <!-- <h1 id="code"></h1>
  <h1 id="codea"></h1> -->
</body>
<script>
  //拿到code 拿到请求id，把这两个请求发给后端
  const codeText = document.getElementById('code')
  const codeTexta = document.getElementById('codea')
  var code = ''
  var requestId = ''

  function getUrlCode() { // 截取url中的code方法
    var url = location.search
    console.log(location.search, 'url')
    var winUrl = url
    var theRequest = new Object()
    if (url.indexOf("?") != -1) {
      var str = url.substr(1)
      var strs = str.split("&")
      for (var i = 0; i < strs.length; i++) {
        theRequest[strs[i].split("=")[0]] = (strs[i].split("=")[1])
      }
    }
    code = theRequest.code
    requestId = theRequest.requestId
  }
  getUrlCode()
  codeText.innerHTML = code
  codeTexta.innerHTML = requestId


  //弹出框
  const agreement = document.getElementById('getElementById')
  const popup = document.getElementById('')
  agreement.onclick = show;

  function show() {
    mask.style.display = "block";
    modal.style.display = "block";
  }

  function close() {
    mask.style.display = "none";
    modal.style.display = "none";
  }
  //请求后端 那openid
  // var appid = 'wxdc7ed0f21b5d80bf&re'
  // window.location.href =
  //`https://open.weixin.qq.com/connect/oauth2/authorize?appid=${appid}&redirect_uri=${encodeURIComponent('https://zg.particlesoft.info/frontenddev/api/OfficialAccounts')}&response_type=code&scope=snsapi_userinfo&state=123#wechat_redirect`;
  // 获取窗口宽高
  function getWindowInfo() {
    var width = window.innerWidth
    var higth = window.innerHeight
    document.querySelector('html').style.fontSize = width / 50 + 'px'

  }
  // 监听页面改变
  function listenResize() {
    window.addEventListener('resize', getWindowInfo)

  }
  listenResize()
</script>

</html>
<style>
  h1 {
    font-size: 3rem;
  }
</style>